<template>
  <a-drawer :title="`运单`" width="70%" :visible="visible"
            hide-cancel
            @cancel="visible = false"
            :footer="false"
            v-if="visible">
    <ma-crud ref="crudRef" :columns="columns" :options="shipmentOptions">
      <template #search-keywords-label="{ searchForm, component }">
        <a-select v-model="searchForm['keywords_type']"
                  style="width:90px"
                  :trigger-props='{trigger:"hover"}'
                  :bordered="false"
                  :options="keywordTypes"
                  default-value="keywords"
                  @change="(v)=>switchKeywordType(searchForm,v)">
        </a-select>
      </template>
      <template #search-keywords="{ searchForm, component }">
        <!-- 显示一个输入框组件，并绑定输入框的v-model -->
        <a-input v-model="searchForm[searchForm['keywords_type']??'keywords']" placeholder="多个请用','割开"/>
      </template>
      <template #shipment_no="{ record }">
        <a-link color="blue" @click="">{{ record.shipment.shipment_no }}</a-link>
        <div class="overflow-hidden text-xs line-clamp-2">
          <a-link status="danger" v-if="record.shipment.work_order">
            <template #icon>
              <icon-stop/>
            </template>
            {{record.shipment.work_order.remark}}
          </a-link>
          <a-link status="danger" v-if="record.shipment.work_order && record.shipment.work_order.intercept == 1">
            <template #icon>
              <icon-stop/>
            </template>
            拦截
          </a-link>
        </div> 
      </template>

      <template #tableButtons>
<!--        <a-button type="primary" @click="">-->
<!--          <icon-eye/>-->
<!--          去运单列表-->
<!--        </a-button>-->
<!--        <a-button type="primary">-->
<!--          <icon-calendar/>-->
<!--          去运单审计-->
<!--        </a-button>-->
        <a-button type="primary" status="danger" @click="deleteParcel" v-auth="['document:waybill:addParcel']">
          <icon-delete/>
          移除
        </a-button>
        <!-- <a-button type="primary" status="" @click="RouteList" v-auth="['document:waybill:shipment']">
          <icon-list/>
          路由分配
        </a-button> -->
      </template>
    </ma-crud>
    <batchActionModal :crud-ref="crudRef" :selected="selected" ref="batchActionRef"/>
  </a-drawer>
</template>
<script setup>
import {computed, inject, ref,watch,reactive} from "vue";
import parcel from "@/api/document/parcel.js";
import waybill from "@/api/document/waybill.js";
import BatchActionModal from "@cps/actions/batchActionModal.vue";
import dictHelp from "@/utils/dicthelp";
const crudRef = ref()
const batchActionRef = ref()

const record = inject('record')
const selected = computed(() => crudRef.value?.selecteds)
const visible = defineModel()
const keywordTypes = [
  //  转单号   供应商单号
  {value: 'keywords', label: '关键字'},
  {value: 'shipment_no', label: '运单号'},
  {value: 'client_reference', label: '客户单号'},
  {value: 'ext_number', label: '扩展单号'},
]
const switchKeywordType = (form,value)=>{
  keywordTypes.map(i=>{
    if(form[i.value] && i.value !== value){
      form[value] = form[i.value]
      form[i.value] = undefined
    }
  })
}
let shipmentOptions = ref({
      rowSelection: {showCheckedAll: true},
      showTools: true,
      tabs:{
        dataIndex:'cancel',
      },
      pageLayout: 'fixed',
      // 默认统一设置列宽度
      columnWidth: 0,
      tableLayoutFixed: true,
      pk: 'id',
      api: parcel.getWaybillList,
      requestParams: {
        waybill_id: record.value.id,
        shipment:1,
      }
    })
const columns = reactive([
  {
      title: "单号",
      dataIndex: "shipment_no",
      formType: "input",
  },
  {
      title: '关键字', dataIndex: 'keywords', search: true, hide: true,
  },
  {
      title: "总箱数",
      dataIndex: "shipment.volume_weight.parcel_count",
      formType: "input",
  },
  {
      title: "计划",
      dataIndex: "jihua",
      formType: "input",
  },
  {
      title: "实际箱数",
      dataIndex: "shiji",
      formType: "input",
  },
  {
      title: "客户展示路由",
      dataIndex: "shipment.info.route_about_waybill_user",
      formType: "select",
      dict:dictHelp.waybill
  },
  {
        title: "状态",
        dataIndex: "cancel",
        formType: "select",
        dict: {
            data:[
              {label:'未扫码',value:1},
              {label:'已扫码',value:2},
              {label:'存疑',value:3},
            ],
            translation: true
        },
        hide:true,
        search:true,
    },
])


const deleteParcel = () => {
  batchActionRef.value.open(
      {
        title: '移除', api: waybill.delParcel, form: {
          key: 'shipment',
          options: {
            layout: 'vertical'
          },
          form: {
            waybill_id: record.value.id,
          },
          columns: [],
          submited: async () => {
            parentCrudRef.value.refresh();
            await getRecord()
            console.log('parentCrudRef', parentCrudRef.value)
          }
        }
      },
    )
}
</script>